
page {
    /* 定义一些主题色及基础样式 */
    font-family: PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif;
    font-size: 28rpx;
    color: $-color-normal;
	padding-bottom: env(safe-area-inset-bottom);
    background-color: $-color-body;
}


.bold {
    font-weight: bold;
}

.bold-400 {
    font-weight: 400;
}
/* 定义字体颜色 */
.black {
    color: $-color-black;
}

.white {
    color: $-color-white;
}

.normal {
    color: $-color-normal;
}

.lighter {
    color: $-color-lighter;
}

.muted {
    color: $-color-muted;
}

/* 定义背景颜色 */
.bg-white {
    background-color: $-color-white;
}
.bg-body {
    background-color: $-color-body;
}
.bg-gray {
    background-color: $-color-border;
}




/* 定义字体大小 */

//36
.xxl {
    font-size: $-font-size-xxl;
}

//34
.xl {
    font-size: $-font-size-xl;
}

//32
.lg {
    font-size: $-font-size-lg;
}

//30 
.md {
    font-size: $-font-size-md;
}
.nr {
  font-size: $-font-size-nr;
}
.sm {
    font-size: $-font-size-sm;
}

.xs {
    font-size: $-font-size-xs;
}

.xxs {
    font-size: $-font-size-xxs;
}

// 定义内外边距，历遍1-80
@for $i from 0 through 60 {
	// 只要双数和能被5除尽的数
	@if $i % 2 == 0 or $i % 5 == 0 {
		// 如：m-30
		.m-#{$i} {
			margin: $i + rpx;
		}
		
		// 如：p-30
		.p-#{$i} {
			padding: $i + rpx;
		}
		
		@each $short, $long in l left, t top, r right, b bottom {
			//结果如： m-l-30
			// 定义外边距
			.m-#{$short}-#{$i} {
				margin-#{$long}: $i + rpx;
			}
			
			// 定义内边距
			//结果如： p-l-30
			.p-#{$short}-#{$i} {
				padding-#{$long}: $i + rpx;
			}
		}
	}
}
.inline {
	display: inline-block;
}
/* 定义常用的弹性布局 */
.flex {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
}

.flex-wrap {
	flex-wrap: wrap;
}

.flex-nowrap {
	flex-wrap: nowrap;
}
.col-baseline {
	align-items: baseline;
}
.col-center {
	align-items: center;
}

.col-top {
	align-items: flex-start;
}

.col-bottom {
	align-items: flex-end;
}
.col-stretch {
	align-items:stretch;
}
.col-between {
	align-content: space-between
}
.row-center {
	justify-content: center;
}

.row-left {
	justify-content: flex-start;
}

.row-right {
	justify-content: flex-end;
}

.row-between {
	justify-content: space-between;
}
.row-around {
	justify-content: space-around;
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.flex-col {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
}


// 定义flex等分
@for $i from 0 through 5 {
	.flex-#{$i} {
		flex: $i;
	}
}
.flex-none {
	flex: none;
}

// 定义字体大小，38-60的字体
@for $i from 38 through 60 {
	@if $i % 2 == 0 {
		.font-size-#{$i} {
			font-size: $i + rpx;
		}
	}
}


/* 超出隐藏 */
/* start--文本行数限制--start */
.line-1 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.line-2 {
    -webkit-line-clamp: 2;
}

.line-3 {
    -webkit-line-clamp: 3;
}

.line-2, .line-3, {
    overflow: hidden;
	word-break: break-all;
    text-overflow: ellipsis; 
    display: -webkit-box; // 弹性伸缩盒
    -webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}

/* 中划线 */
.line-through {
    text-decoration: line-through;
}

.word-break-all{
	word-break: break-all;
}


/* br60 */
@for $i from 0 through 60 {
	@if $i % 10 == 0 {
		.br#{$i} {
			border-radius: $i + rpx;
		}
	}
}

/* 初始化按钮 */
page button {
    margin: 0;
    background-color: transparent;
    font-weight: normal;
    font-size: 28rpx;
    overflow: unset;
	margin-left: 0;
	margin-right: 0;
	padding: 0 30rpx;
}
page button::after {
	border: none;
}

/* 按钮大小 */
button[size="xs"]{
    line-height: 58rpx;
    height: 58rpx;
    font-size: 26rpx;
}

button[size="sm"] {
    line-height: 62rpx;
    height: 62rpx;
    font-size: 28rpx;
}

button[size="md"]{
    line-height: 70rpx;
    height: 70rpx;
    font-size: 30rpx;
}
button[size="lg"]{
    line-height: 80rpx;
    height: 80rpx;
    font-size: 32rpx;
}


.img-null {
	width: 300rpx;
	height: 300rpx;
}
.u-image image {
  display: block;
}
/* 隐藏滚动条 */
::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
}








.OuterBox{
	width: 100%;
	padding: 20rpx;
	min-height: 100vh;
	position: relative;
}
.InnerBox{
	width: 100%;
	border-radius: 20rpx;
	background: rgba(255, 255, 255, 1);
	margin-bottom: 20rpx;
}
.datalist{
    width: 100%;
}
.data_val{
	width: 100%;
	border-radius: 14rpx;
	background: rgba(255, 255, 255, 1);
	margin-bottom: 20rpx;
}
.data_val:last-of-type{
	margin-bottom: 0;
}        
/* 多行文本超出省略号隐藏 */
.MultipleLines {
	overflow: hidden;
	text-overflow: ellipsis;
	/* 弹性伸缩盒子模型显示  */
	display: -webkit-box;
			/* 限制早一个块元素显示的文本的行数 */
	-webkit-line-clamp: 2;
			/* 设置或检索伸缩盒对象的子元素的排列方式 */
	-webkit-box-orient: vertical;
}
// 单行
.Singlerow {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.FlexAlign{
	display: flex;
	align-items: center;
}


.FlexRow {
  display: flex;
  align-items: center;
  justify-content: center;
}

.FlexColumn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.FlexBetween {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
/* 父元素-flex容器 */
.FlexBox {
  display: flex;
}
/* 子元素-平均分栏 */
.FlexItem {
  flex: 1;
}

.FlexAliEnd {
  align-items: flex-end;
}

.FlexJusStart {
  justify-content: flex-start;
}


.tc_InputBox{
	width: 100%;
	height: 80rpx;
	border-radius: 12rpx;
	background: #F1F3F7;
	overflow: hidden;
	padding: 0 30rpx 0 26rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	&.white{
		background: #fff;
		
	}
	.input_val{
		display: flex;
		align-items: center;
		font-size: 26rpx;
		font-weight: 400;
		color: rgba(153, 153, 153, 1);
		text-align: left;
		vertical-align: top;
		// max-width: 450rpx;
		// width: 100%;
		flex: 1;
		height: 100%;
		&.islocat::before{
			content: '';
			display: inline-block;
			margin-right: 10rpx;
			width: 14rpx;
			height: 14rpx;
			border-radius: 100%;
			background: #0AAF73;

		}
	}
	input::placeholder{
		font-size: 26rpx;
		font-weight: 400;
		color: rgba(153, 153, 153, 1);
	}
	.icon{
		i{
			color: #666666;
			font-size: 24rpx;
		}
	}
}

.PupSelectList {
	width: 100%;
	
	
	
	.PupSelectItem{
		width: 156rpx;
		height: 116rpx;
		border-radius: 24rpx;
		background: #fff;
		border: 2rpx solid rgba(236, 235, 240, 1);
		line-height: 116rpx;
		
		font-size: 32rpx;
		font-weight: 550;
		color: rgba(38, 38, 38, 1);
		text-align: center;
		&.isActive{
			background: rgba(232, 238, 255, 1);
			border: 3rpx solid rgba(6, 96, 216, 1);
		}
		&.isActive2{
			color: #FF5628;
			background: #FFF2EB;
			border: 3rpx solid #FF5628;
		}
		&.isActive3{
			color: #FF9527;
			background: #FFF9F0;
			border: 3rpx solid #FF9527;
		}
		&.isVehicle{
			width: 210rpx;
		}
	}
	
	&.ThemeTemp1 {
		.PupSelectItem.is_Active {
			background: rgba(232, 238, 255, 1);
			border: 3rpx solid rgba(6, 96, 216, 1);
		}
	}
	
	&.ThemeTemp2 {
		.PupSelectItem.is_Active {
			color: #FF9527;
			background: #FFF2EB;
			border: 3rpx solid #FF9527;
		}
	}
	
	&.ThemeTemp3 {
		.PupSelectItem.is_Active {
			color: #FF5628;
			background: #FFF9F0;
			border: 3rpx solid #FF5628;
		}
	}
	
	&.ThemeTemp4 {
		.PupSelectItem.is_Active {
			color: $uniThemeColor;
			background: #F0FAFA;
			border: 4rpx solid $uniThemeColor;
		}
	}
}

.defstar::before{
	content: '*';
	color: red;
	font-size: 35rpx;
	display:inline-block;
	margin-right: 8rpx;
}
.tonctit{
	font-size: 32rpx;
	font-weight: 700;
	color: rgba(38, 38, 38, 1);
	text-align: left;
	vertical-align: top;
	
}

.pagesticky{
	width: 100%;
	padding: 20rpx;
	background: #F3F4F5;
	position: sticky;
	bottom: 0;
	left: 0;
	z-index: 100;
}
.defconfirm_btn {
	width: 100%;
	height: 100rpx;
	opacity: 1;
	border-radius: 12rpx;
	background: linear-gradient(90deg, rgba(1, 92, 214, 1) 0%, rgba(88, 159, 252, 1) 100%);
	
	display: flex;
	align-items: center;
	justify-content: center;

	font-size: 32rpx;
	font-weight: 700;
	color: rgba(255, 255, 255, 1);
	text-align: center;
	vertical-align: top;
	&.whitebtn{
		background: #fff;
		color: #025DD7;
		border:solid 1px ;
	}
	&.hollow{
		background: none;
		color: #003232;
		border:solid 1px ;
	}
}

.gradient_Direct, .ThemeBack1 {
	color: #fff !important;
	border: none !important;
	background: linear-gradient(90deg, rgba(1, 92, 214, 1) 0%, rgba(88, 159, 252, 1) 100%) !important;
	
}

.gradient_Welcab, .ThemeBack2{
	color: #fff !important;
	border: none !important;
	background: linear-gradient(90deg, #FF5628 0%, #FF781F 100%) !important;
}

.gradient_orange, .ThemeBack3{
	color: #fff !important;
	border: none !important;
	// background: linear-gradient(90deg, #FF9326 0%, #FFC233 100%) !important;
	background: linear-gradient(90deg, #FF5628 0%, #FF781F 100%) !important;
}

.gradient_orange, .ThemeBack4{
	color: #E6FF28 !important;
	border: none !important;
	background: linear-gradient(90deg, rgba(0, 50, 50, 1) 0%, rgba(3, 89, 89, 1) 100%) !important;
}


.gradient_bg1 {
	color: #fff !important;
	border: none !important;
	background: linear-gradient(90deg, rgba(1, 92, 214, 1) 0%, rgba(88, 159, 252, 1) 100%) !important;
}
.gradient_bg2 {
	color: #fff !important;
	border: none !important;
	background: linear-gradient(90deg, #FF9326 0%, #FFC233 100%) !important;

}
.gradient_bg3 {
	color: #fff !important;
	border: none !important;
	background: linear-gradient(90deg, #FF5628 0%, #FF781F 100%) !important;
}

.gradient_bg4 {
	
	color: #E6FF28 !important;
	border: none !important;
	background: linear-gradient(90deg, rgba(0, 50, 50, 1) 0%, rgba(3, 89, 89, 1) 100%);
	i{
		color: inherit;
	}
}

.ThemeColor1 {
	color: #3270E0 !important;
}
.ThemeColor2 {
	color: #FF5728 !important;
}
.ThemeColor3 {
	color: #FFAA3C !important;
}

.DisableBox{
	position: relative;
	width: 100%;
	&::after{
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 100;
		
	}
}


.operateVal{
	white-space: nowrap;
	padding: 0 20rpx;
	// display:inline-block;
	height: 52rpx;
	border-radius: 6rpx;
	background: rgba(255, 255, 255, 1);
	border: 2rpx solid rgba(50, 112, 224, 1);
	
	font-size: 24rpx;
	font-weight: 400;
	color: rgba(50, 112, 224, 1);
	text-align: center;
	margin-left: 15rpx;
}

.defcheck{

	width: 24rpx;
	height: 24rpx;
	border-radius: 100%;
	border: 2rpx solid rgba(204, 204, 204, 1);
	background: #fff;
	i{
		color: #fff;
		font-size: 20rpx;
	}
	&.isCheck{
		background: #316fe0;
		border-color: #316fe0;
	}
}